<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>2-5正多边形</title>
</head>
<body>
<div id="c"></div>

<script src="../js/matter.js"></script>
<script>
  let Engine = Matter.Engine // 引擎.引擎模块包含创建和操作引擎的方法
  let Render = Matter.Render // 基于HTML5画布的渲染器
  let Bodies = Matter.Bodies // 用于创建各种形状的物体，物体必须添加到Wolrd中，然后由引擎运行世界
  let Composite = Matter.Composite // 复合体，旧版的 Matter.World 已经合并到这个模块里

  // 创建引擎
  let engine = Engine.create()

  // 创建渲染器
  let render = Render.create({
    element: document.getElementById('c'), // 绑定页面元素,
    engine: engine,
    options: {
      width: 400,
      height: 400,
      wireframes: false, // 关闭线框模式
      showVelocity: true // 显示速度
    }
  })

  // 梯形 x, y, sides, radius
  let polygon = Matter.Bodies.polygon(200, 200, 7, 40)

  Composite.add(engine.world, polygon)

  Render.run(render)
</script>
</body>
</html>